<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="css/bootstrap.min.css" />
    <link rel="stylesheet" href="css/font-awesome.css" />
    <script src="js/vue.js"></script>
    <script src="js/vendor/jquery-1.12.4.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/jquery.cookie.min.js"></script>
</head>
<style>
    * {
        margin: 0;
        padding: 0;
    }
    body {
        background-color: #EEEEEE;
    }
    .navbar-text a  {
        color: #ffffff;
    }
    .login-text {
        margin-right: 50px;
    }
    .logo {
        color: #E94F4C;
        font-size: 35px;
        display: inline-block;
    }
    .search-box {
        height: 48px;
    }
    .input-group-addon {
        background-color:#E94F4C;
        border: none;
        color: #ffffff;
    }
    .control-icon {
        position: absolute;
        top: 50%;
    }
    .mgt38 {
        margin-top: 30px;
    }
    .thumbnail a img {
        height: 200px;
        width: 200px;
    }
    .thumbnail .description {
        height: 40px;
        overflow: hidden;
    }
    a:hover {
        text-decoration: none;
    }
    h3, p {
        text-align: center;
    }
    table tr {
        background-color: #ffffff;
    }
</style>
<body>
    <nav class="navbar navbar-default navbar-inverse navbar-static-top">
        <div class="container-fluid">
            <div class="navbar-header">
                <a href="前端首页.html" class="navbar-brand" style="color: #ffffff;"><i class="fa fa-sign-language"></i> 寻欢易购</a>
            </div>
            <p class="navbar-text navbar-right login-text">
                <a id="loginText" href="登录页面.html">登录</a>
            </p>
            <p class="navbar-text navbar-right">
                <a href="仿京东注册.html">注册</a>
            </p>
        </div>
    </nav>
    <div class="container-fluid">
        <div class="row">
            <div class="col-xs-8 col-xs-push-2">
                <table id="app" class="table">
                    <thead>
                        <tr>
                            <td>商品</td>
                            <td>单价</td>
                            <td>数量</td>
                            <td>小计</td>
                            <td>操作</td>
                        </tr>
                    </thead>
                    <tbody >
                        <tr>
                            <td style="max-width: 200px;">
                                <div class="media">
                                    <div class="media-left">
                                        <a href="javascript: void(0);">
                                            <img class="media-object" height="80px" width="62px" src="http://localhost/shoes/nike.jpg">
                                        </a>
                                    </div>
                                    <div class="media-body">
                                        <h4 class="media-heading">耐克 NIKE AF1 SHADOW  女子运动鞋 CI0919 CI0919-400 39</h4>
                                    </div>
                                </div>
                            </td>
                            <td>567</td>
                            <td>

                                <div class="input-group" style="width: 150px;">

                                    <span style="background-color: #e2e2e2;" class="input-group-addon">-</span>
                                   <!--
                                    <span onclick="reduceGoodNum(this)" class="input-group-addon" style="cursor: pointer;">-</span>
                                    -->
                                    <input class="form-control" value="1">

                                    <span class="input-group-addon" onclick="addGoodNum(this)" style="cursor: pointer;">+</span>
                                </div>
                            </td>
                            <td>2</td>
                            <td>
                                <button :id="g.goodId" onclick="deleteSpecifyGood(this)" class="btn btn-default">删除</button>
                            </td>
                        </tr>
                    </tbody>
                    <tfoot>
                        <tr v-if="goods.length != 0">
                            <td colspan="5">
                                已选购 <span id="totalCount" style="color: red;">2</span> 件商品,
                                总价 <span  style="color: red;" id="totalPrice">20000</span>
                                <button onclick="gotoSettleCount()" class="btn btn-danger btn-lg">去结算</button>
                            </td>
                        </tr>
                        <!-- 如果没有商品，就是显示。
                        <tr>
                            <td colspan="5">暂无商品.<a href="前端首页.html">去购物</a></td>
                        </tr>
                        -->
                    </tfoot>
                </table>
            </div>
        </div>
    </div>
</body>
    <script>
    </script>
</html>